<link rel="stylesheet" href="component/assets/css/bootstrap-duallistbox.css" />
<link rel="stylesheet" href="component/assets/css/select2.css" />
<link rel="stylesheet" href="component/assets/css/bootstrap-datetimepicker.css" />
<style type="text/css">
.ui-jqgrid-sortable {
	text-align: center;
}
</style>

<div id="plan_container">
	<input type="hidden" id="allPlanId"/>
	<input type="hidden" id="wenjuanOptionId"/>
	<div class="row">
		<div class="col-xs-12">



			<table id="plan_grid-table"></table>

			<div id="plan_grid-pager"></div>

		</div>
		<!-- /.col -->
	</div>
	<!-- /.row -->


	<div id="planModalDiv" class="modal fade" tabindex="-1"
		data-backdrop="static">
		<div class="modal-dialog" style="width: 1000px !important;">
			<div class="modal-content">
				<div class="modal-header no-padding">
					<div class="table-header">
						<button type="button" class="close" data-dismiss="modal"
							aria-hidden="true">
							<span class="white">&times;</span>
						</button>
						<span id="planDialogTitle">添加业主</span>
					</div>
				</div>
				<div class="modal-body"
					style="max-height: 620px; overflow-y: scroll;">
					<div id="modal-tip" class="red clearfix"></div>
					<form id="planForm" name="planForm"
						class="form-horizontal  col-xs-12">
						<div class="widget-box  ui-sortable-handle">
							<div class="widget-header">
								<h4 class="widget-title">基本信息</h4>
							</div>
							<div class="widget-body">
								<input type="hidden" name="id" id="planId" /> 
								<input type="hidden" name="files" id="planfiles" />
								<div class="widget-main">
									<div class="row" style="padding-bottom: 2px">
										<div class="form-group">
											<label class="col-xs-2 control-label">方案名称</label>
											<div class="col-xs-7">
												<input type="text" class="form-control" id="planName"
													name="name" />
											</div>
										</div>
									</div>
									<div class="row" style="padding-bottom: 2px">
										<div class="form-group">
											<label class="col-xs-2 control-label">方案概述</label>
											<div class="col-xs-10">
												<textarea id="planTitle" name="title"
												class="autosize-transition form-control"></textarea>
											</div>
										</div>
									</div>
									<div class="row" style="padding-bottom: 2px">
										<div class="form-group">
											<label class="col-xs-2 control-label">方案规则</label>
											<div class="col-xs-10">
												<textarea id="planRole" name="role"
												class="autosize-transition form-control"></textarea>
											</div>
										</div>
									</div>
									<div class="row" style="padding-bottom: 2px">
										<div class="form-group">
											<label class="col-xs-2 control-label">开始时间</label>
											<div class="col-xs-3">
												<!-- #section:plugins/date-time.datepicker -->
												<div class="input-group">
													<input class="form-control" id="planStartTime" type="text" name="planStartTime" />
													<span class="input-group-addon"> 
														<i class="fa fa-clock-o bigger-110"></i>
													</span>
												</div>
											</div>
										</div>
									</div>
									<div class="row" style="padding-bottom: 2px">
										<div class="form-group">
											<label class="col-xs-2 control-label">结束时间</label>
											<div class="col-xs-3">
												<!-- #section:plugins/date-time.datepicker -->
												<div class="input-group">
													<input class="form-control" id="planEndTime" type="text" name="planEndTime" />
													<span class="input-group-addon"> 
														<i class="fa fa-clock-o bigger-110"></i>
													</span>
												</div>
											</div>
										</div>
									</div>
									<div class="row" style="padding-bottom: 2px">
										<div class="form-group">
											<label class="col-xs-2 control-label">详细描述</label>
											<div class="col-xs-10">
												<textarea id="planDescription" name="description"
												class="autosize-transition form-control" rows="10"></textarea>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
						<div class="row" style="padding-bottom: 2px;">
							<div class="col-xs-12">
								<div class="widget-box  ui-sortable-handle">
									<div class="widget-header">
										<h4 class="widget-title">方案图片</h4>
										<div class="widget-toolbar">
											<a href="#" title="添加图片" data-action="settings"> <i
												class="1 ace-icon fa bigger-125  fa-cloud-upload fileinput-button"></i>
											</a>
										</div>
									</div>
									<div class="widget-body">
										<div class="widget-main">
											<div class="dropzone" id="plandropzone"></div>
										</div>
									</div>
								</div>
							</div>
						</div>

					</form>

				</div>
				<div class="modal-footer no-margin-top">
					<div class="text-center">

						<button id="submitplanBtn" class="btn btn-sm btn-primary">
							<i class="ace-icon fa fa-floppy-o"></i> <span>保存</span>
						</button>

						<button class="btn btn-sm" data-dismiss="modal">
							<i class="ace-icon fa fa-share "></i> <span>取消</span>
						</button>
					</div>
				</div>
			</div>
		</div>
		<!-- /.modal-content -->

		<div id="planpreview-template" style="display: none">
			<div class="dz-preview dz-file-preview">
				<div class="dz-details">
					<div class="dz-filename">
						<span data-dz-name></span>
					</div>
					<div class="dz-size" data-dz-size></div>
					<a id='' href='#' class="image-see" data-rel='colorbox'><img
						data-dz-thumbnail /> </a>
				</div>
				<div class="dz-progress">
					<span class="dz-upload" data-dz-uploadprogress></span>
				</div>
				<div class="dz-success-mark">
					<span>✔</span>
				</div>
				<div class="dz-error-mark">
					<span>✘</span>
				</div>
				<div class="dz-error-message">
					<span data-dz-errormessage></span>
				</div>
				<div class="center">
					<span data-dz-remove> <a href="#" data-action="delete"
						class="middle"> <i
							class="ace-icon fa fa-trash-o red bigger-130 middle"></i>
					</a>
					</span>
				</div>
			</div>
		</div>
	</div>
	
	<div id="courtBindDiv" class="modal fade" tabindex="-1"
		data-backdrop="static">
		<input type="hidden" id="planIdincourt">
		<div class="modal-dialog" style="width: 700px !important;">
			<div class="modal-content">
				<div class="modal-header no-padding">
					<div class="table-header">
						<button type="button" class="close" data-dismiss="modal"
							aria-hidden="true">
							<span class="white">&times;</span>
						</button>
						<span>绑定小区</span>
					</div>
				</div>
				<div class="modal-body"
					style="max-height: 500px;height:500px; overflow-y: scroll;">
					<div id="courtmodal-tip" class="red clearfix"></div>
					<div style="height:100%">
						<div style="width:640px;height:100%;margin-left:10px;">
							<div class="row">
								<div class="col-xs-12">
									<div id="search_box" class="widget-box  ui-sortable-handle collapsed">
										<div class="widget-header">
											<div class="nav-search" style="padding-top: 4px; left: 25px">
												<span class="input-icon"> 
												<input type="text" id="courtname2" 
													placeholder="请输入小区名称" class="nav-search-input"> 
												<i class="ace-icon fa fa-search nav-search-icon"></i>
												</span>
											</div>
											
											<div id="searchCourtDiv" class="input-group col-xs-12  col-sm-6  "
												style="width:50px;top: 1px;float:right;">
												<span class="input-group-btn">
													<button id="searchCourtBtn" type="button"
														class="btn btn-purple btn-sm">
														<span class="ace-icon fa fa-search icon-on-right bigger-110"></span>
														<span i18n="find"></span>
													</button>
												</span>
											</div>
											
										</div>
									</div>
									<div class="form-group">
										<div class="col-sm-8" style="width:650px" id="emptydualCourtlist">
											<!-- #section:plugins/input.duallist -->
											<select multiple="multiple" name="duallistbox_court" id="dualCourtlist"
											 style="height:325px;"></select>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="modal-footer no-margin-top">
					<div class="text-center">

						<button id="submitCourtBindBtn" class="btn btn-sm btn-primary">
							<i class="ace-icon fa fa-floppy-o"></i> <span>保存</span>
						</button>

						<button class="btn btn-sm" data-dismiss="modal">
							<i class="ace-icon fa fa-share "></i> <span>取消</span>
						</button>
					</div>
				</div>
			</div>
		</div>
	</div>
	
	<div id="optionGridDiv" class="modal fade" tabindex="-1"
		data-backdrop="static">
		<div class="modal-dialog" style="width: 700px !important;">
			<div class="modal-content">
				<div class="modal-header no-padding">
					<div class="table-header">
						<button type="button" class="close" data-dismiss="modal"
							aria-hidden="true">
							<span class="white">&times;</span>
						</button>
						<span>管理问卷调查选项</span>
					</div>
				</div>
				<div class="modal-body" style="max-height: 450px; overflow-y: scroll;">
					<div class="row">
						<div class="col-xs-12">
							<table id="option_grid-table"></table>
							<div id="option_grid-pager"></div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	
	<div id="optionModalDiv" class="modal fade" tabindex="-1"
		data-backdrop="static">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header no-padding">
					<div class="table-header">
						<button type="button" class="close" data-dismiss="modal"
							aria-hidden="true">
							<span class="white">&times;</span>
						</button>
						<span>添加问卷调查选项</span>
					</div>
				</div>
				<div class="modal-body"
					style="max-height: 850px; overflow-y: scroll;">
					<div id="optionmodal-tip" class="red clearfix"></div>
					<form id="optionForm" name="optionForm"
						class="form-horizontal  col-xs-12">
						<div class="widget-box  ui-sortable-handle">
							<div class="widget-header">
								<h4 class="widget-title">基本信息</h4>
							</div>
							<div class="widget-body">
								<input type="hidden" name="planid" id="planId2" />
								<input type="hidden" name="id" id="optionId" /> 
								<div class="widget-main">
									<div class="row" style="padding-bottom: 2px">
										<div class="form-group">
											<label class="col-sm-3 control-label">详细描述</label>
											<div class="col-sm-9">
												<textarea id="optionDetail" name="detail"
												class="autosize-transition form-control" rows="10"></textarea>
											</div>
										</div>
									</div>
								
									<div class="row" style="padding-bottom: 2px">
										<div class="form-group">
											<label class="col-sm-3 control-label">同意字段</label>
											<div class="col-sm-9">
												<input type="text" class="form-control" id="optionAgree"
													name="agree" />
											</div>
										</div>
									</div>
									
									<div class="row" style="padding-bottom: 2px">
										<div class="form-group">
											<label class="col-sm-3 control-label">否定字段</label>
											<div class="col-sm-9">
												<input type="text" class="form-control" id="optionDisagree"
													name="disagree" />
											</div>
										</div>
									</div>
									
									<div class="row" style="padding-bottom: 2px">
										<div class="form-group">
											<label class="col-sm-3 control-label">排序</label>
											<div class="col-sm-9">
												<input type="text" class="form-control" id="optionOptionorder"
													name="optionorder" />
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
					</form>
				</div>
				<div class="modal-footer no-margin-top">
					<div class="text-center">

						<button id="submitOptionBtn" class="btn btn-sm btn-primary">
							<i class="ace-icon fa fa-floppy-o"></i> <span>保存</span>
						</button>

						<button class="btn btn-sm" data-dismiss="modal">
							<i class="ace-icon fa fa-share "></i> <span>取消</span>
						</button>
					</div>
				</div>
			</div>
		</div>
	</div>
	
	<div id="voteResultGridDiv" class="modal fade" tabindex="-1"
		data-backdrop="static">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header no-padding">
					<div class="table-header">
						<button type="button" class="close" data-dismiss="modal"
							aria-hidden="true">
							<span class="white">&times;</span>
						</button>
						<span>查看投票结果</span>
					</div>
				</div>
				<div class="modal-body" style="max-height: 650px; overflow-y: scroll;">
					<div class="row">
						<div class="col-xs-12">
							<div id="searchvoteResult_box" class="widget-box  ui-sortable-handle collapsed">
								<div class="widget-header">
									<div class="nav-search" style="padding-top: 10px; left: 25px">
										<span class="input-icon"> 
										<input type="text" id="proprietorName2" 
											placeholder="请输入业主姓名" class="nav-search-input"> 
										<i class="ace-icon fa fa-search nav-search-icon"></i>
										</span>
									</div>
									
									<div class="form-group">
										<div id="courtVoteResultDiv" class="col-xs-12 col-sm-9" style="width:300px;left:170px;top:8px;">
											<select class="form-control" id="courtVoteResultSelect">
											</select>
										</div>
									</div>
									
									<div id="searchVoteResultDiv" class="input-group col-xs-12  col-sm-6  "
										style="width:50px;bottom: 8px;float:right;">
										<span class="input-group-btn">
											<button id="searchVoteResultBtn" type="button"
												class="btn btn-purple btn-sm">
												<span class="ace-icon fa fa-search icon-on-right bigger-110"></span>
												<span i18n="find"></span>
											</button>
										</span>
									</div>
								</div>
							</div>
							<table id="voteResult_grid-table"></table>
							<div id="voteResult_grid-pager"></div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	
	<div id="changeVoteStateDiv" class="modal fade" tabindex="-1"
		data-backdrop="static">
		<div class="modal-dialog" style="width:250px;">
			<div class="modal-content">
				<div class="modal-header no-padding">
					<div class="table-header">
						<button type="button" class="close" data-dismiss="modal"
							aria-hidden="true">
							<span class="white">&times;</span>
						</button>
						<span>改变方案状态</span>
					</div>
				</div>
				<div class="modal-body" style="max-height: 350px; overflow-y: scroll;">
					<div class="row">
						<div class="control-group" id="planStateRadioDiv">
							<div class="radio">
								<label>
									<input name="planState" id="planStateYes" type="radio" class="ace" />
									<span class="lbl"> 启用</span>
								</label>
							</div>
							<div class="radio">
								<label>
									<input name="planState" id="planStateNo" type="radio" class="ace" />
									<span class="lbl"> 停用</span>
								</label>
							</div>
						</div>
					</div>
				</div>
				<div class="modal-footer no-margin-top">
					<div class="text-center">
						<button id="submitPlanStateBtn" class="btn btn-sm btn-primary">
							<i class="ace-icon fa fa-floppy-o"></i> <span>保存</span>
						</button>
						<button class="btn btn-sm" data-dismiss="modal">
							<i class="ace-icon fa fa-share "></i> <span>取消</span>
						</button>
					</div>
				</div>
			</div>
		</div>
	</div>
	
	<div id="checkLeaveMessageGridDiv" class="modal fade" tabindex="-1"
		data-backdrop="static">
		<input type="hidden" id="leaveMessagePlanId"/>
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header no-padding">
					<div class="table-header">
						<button type="button" class="close" data-dismiss="modal"
							aria-hidden="true">
							<span class="white">&times;</span>
						</button>
						<span>查看业主留言</span>
					</div>
				</div>
				<div class="modal-body" style="max-height: 750px; overflow-y: scroll;">
					<div class="row">
						<div class="col-xs-12">
							<div id="searchLeaveMessage_box" class="widget-box  ui-sortable-handle collapsed">
								<div class="widget-header">
									<div class="nav-search" style="padding-top: 10px; left: 25px">
										<span class="input-icon"> 
										<input type="text" id="proprietorName3" 
											placeholder="请输入业主姓名" class="nav-search-input"> 
										<i class="ace-icon fa fa-search nav-search-icon"></i>
										</span>
									</div>
									
									<div class="form-group">
										<div id="courtLeaveMessageDiv" class="col-xs-12 col-sm-9" style="width:300px;left:170px;top:8px;">
											<select class="form-control" id="courtLeaveMessageSelect">
											</select>
										</div>
									</div>
									
									<div id="searchLeaveMessageDiv" class="input-group col-xs-12  col-sm-6  "
										style="width:50px;bottom: 8px;float:right;">
										<span class="input-group-btn">
											<button id="searchLeaveMessageBtn" type="button"
												class="btn btn-purple btn-sm">
												<span class="ace-icon fa fa-search icon-on-right bigger-110"></span>
												<span i18n="find"></span>
											</button>
										</span>
									</div>
								</div>
							</div>
							<table id="leaveMessage_grid-table"></table>
							<div id="leaveMessage_grid-pager"></div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- /.modal-dialog -->
</div>

<script type="text/javascript">

var planScripts = [ null,"component/assets/js/dropzone.js", 
	"component/assets/js/jquery.colorbox.js", "component/assets/js/select2.js",
	"component/assets/js/jquery.bootstrap-duallistbox.js",
	"component/assets/js/date-time/moment.js",
	"component/assets/js/date-time/moment_zh-CN.js",
	"component/assets/js/date-time/bootstrap-datetimepicker.js",
	null ];
var $planContainer = $('#plan_container');
var planGrid = null;
var optionGrid = null;
var voteResultGrid = null;
var leaveMessageGrid = null;
var $validateplanForm = null;
var countbindContainer=null;
var courtbindBox=null;
var planDropzone=null;
var planMuban=null;

var colorbox_params = {
    rel : 'colorbox',
    reposition : true,
    scalePhotos : true,
    scrolling : false,
    previous : '<i class="ace-icon fa fa-arrow-left"></i>',
    next : '<i class="ace-icon fa fa-arrow-right"></i>',
    close : '&times;',
    current : '{current} of {total}',
    maxWidth : '100%',
    maxHeight : '90%',
    onOpen : function() {
	$overflow = document.body.style.overflow;
	document.body.style.overflow = 'hidden';
    },
    onClosed : function() {
	document.body.style.overflow = $overflow;
    },
    onComplete : function() {
	$.colorbox.resize();
    }
};

$('.page-content-area').ace_ajax('loadScripts', planScripts, function() {
	var grid_selector  = "#plan_grid-table";
	var pager_selector = "#plan_grid-pager";
	
	var colNames =['',
		'名称','概述','规则' ,'描述','开始时间','结束时间','状态',
        '操作' 
	];
	createplanGrid();
	
	$validateplanForm = $('#planForm',$planContainer).validate({
    	onsubmit:false,
    	rules : {
    		name : {
				required : true,
				maxlength: 35
			},
			title : {
				required : true,
				maxlength: 45
			},
			role : {
				required : true,
				maxlength: 180
			},
			planStartTime : {
				required : true
			},
			planEndTime : {
				required : true
			},
			description : {
				required : true,
				maxlength: 350
			}
		}
    });
	
	$validateOptionForm = $('#optionForm',$planContainer).validate({
    	onsubmit:false,
    	rules : {
    		detail : {
				required : true,
				maxlength: 350
			},
			agree : {
				required : true,
				maxlength: 15
			},
			disagree : {
				required : true,
				maxlength: 15
			},
			optionorder : {
				required : true,
				digits:true
			}
		}
    });
	
	$('#planStartTime,#planEndTime').datetimepicker({
		locale: 'moment_zh-CN', 
		format : 'YYYY/MM/DD HH:mm:ss'
	}).next().on(ace.click_event, function(){
		$(this).prev().focus();
	});
	
	$('#submitplanBtn').click(function(){
		if(!$validateplanForm.checkForm()){
			$validateplanForm.defaultShowErrors();
			return;
		}
		var url = $(this).attr("url");
		var fileIds = [];
		var id = $('#planId2',$("#planForm",$planContainer)).val();
		$('.dropzone [data-rel="colorbox"]').map(function(k, v) {
			fileIds.push(v.id);
	    })
	    $("#planfiles", $planContainer).val(fileIds);
		var message="";
		if(id && id !=""){
			message="确定要修改这条记录吗？"
		}else{
			message="确定要添加一条记录吗？"
		}
		
		
		$.loy.confirm(message,function(){
	        $.loy.ajax({
				url:url,
				data:$("#planForm",$planContainer).serialize(),
				success:function(data){
					$('#planModalDiv',$planContainer).modal("hide");
					planGrid.jqGrid().trigger("reloadGrid");
				},
				error : function(data){
					alert("发生错误");
				}
			});  
		});	
    });
	
	$("#submitCourtBindBtn").on("click",function(){
		var courtIds=$("#dualCourtlist").val();
		var ids="";
		var url="";
		var datas="";
		var message="确定要为该小区绑定所选择的小区吗？";
		var message2="绑定成功";
		if(courtIds==""||courtIds==null){
			message="该方案没有选择小区，需要执行解绑操作吗？";
			message2="解绑成功";
			url="fatp/unbindcourt";
			datas={
				id : $("#planIdincourt").val()
			}
		}else{
			url="fatp/bindcourt";
			for (var i = 0; i < courtIds.length; i++) {
				if(i==0){
					ids+=courtIds[i];
				}else{
					ids+=","+courtIds[i];
				}
			}
			datas={
				planid : $("#planIdincourt").val(),
				courtid : ids
			}
		}
		$.loy.confirm(message,function(){
			//为用户绑定门牌号
			$.loy.ajax({
				url : url,
				type : 'POST',
				data : datas,
				success:function(data){
					$.loy.alert(message2);
					$('#courtBindDiv', $planContainer).modal("hide");
				},
				error : function(data){
				}
		   });   
	    })
	});
	
	$("#searchCourtBtn").on("click",function(){
		//查询未被绑定的小区相关信息
		$.loy.ajax({
			url : "/xq/findNotSelectedCourt",
			type : 'GET',
			data : {
				courtName : $.trim($("#courtname2").val()),
				planid : $("#planIdincourt").val()
			},
			success : function(data) {
				var result=data.data;
				courtbindBox.bootstrapDualListbox('destroy');
				courtbindBox=null;
				$("#emptydualCourtlist").empty();
			 	var select=$("<select></select>");	
			 	select.css("height","325px");
			 	select.attr({"multiple":"multiple","name":"duallistbox_court","id":"dualCourtlist"});
				for (var i = 0; i < result.length; i++) {
					var option=$("<option></option>");
					option.val(result[i].id);
					option.text(result[i].name);
					select.append(option);
				}
				//加载已经绑定了的小区
				$.loy.ajax({
					url : "/xq/findSelectedCourt",
					type : 'GET',
					data : {
						planid : $("#planIdincourt").val()
					},
					success : function(data) {
						var result=data.data;
						for (var i = 0; i < result.length; i++) {
							var option=$("<option></option>");
							option.val(result[i].id);
							option.text(result[i].name);
							option.attr("selected","selected");
							select.append(option);
						}
						$("#emptydualCourtlist").append(select);
						courtbindBox=select.bootstrapDualListbox({
							showFilterInputs:false
						});
						countbindContainer = courtbindBox.bootstrapDualListbox('getContainer');
						countbindContainer.find('.btn').addClass('btn-white btn-info btn-bold');
						courtbindBox.bootstrapDualListbox('refresh',true);
					},
					error : function(data){
					}
				})
			},
			error : function(data) {
				alert("查询绑定小区信息发生错误");
			}
	   });
	});
	
	$("#submitPlanStateBtn").on("click",function(){
		$('#allPlanId').val();
		var planState="";
		var checkedid=$("#planStateRadioDiv").find("input[type='radio']:checked").attr("id");
		if(checkedid=="planStateYes"){
			planState=3;
			message="确定要进行这个投票方案吗？"
		}
		if(checkedid=="planStateNo"){
			planState=4;
			message="确定要停止这个投票方案吗？"
		}
		var that = this;
		$.loy.confirm(message, function() {
			$.loy.ajax({
				url : 'fatp/changePlanState',
				data : {
					id : $('#allPlanId').val(),
					planState : planState
				},
				success : function(data) {
					$('#changeVoteStateDiv', $planContainer).modal("hide");
					planGrid.jqGrid().trigger("reloadGrid");
				}
			});
		});
	})
	
	$("#searchVoteResultBtn").on("click",function(){
		createVoteResultGrid($("#wenjuanOptionId").val());
	})
	
	$("#searchLeaveMessageBtn").on("click",function(){
		createLeaveMessageGrid($("#leaveMessagePlanId").val());
	})
	
	$('#courtBindDiv').on('hide.bs.modal', function () {
		$('[class*=select2]').remove();
		courtbindBox.bootstrapDualListbox('destroy');
		courtbindBox=null;
		$("#emptydualCourtlist").empty();
	 	var select=$("<select></select>");	
	 	select.css("height","325px");
	 	select.attr({"multiple":"multiple","name":"duallistbox_court","id":"dualCourtlist"});
	 	$("#emptydualCourtlist").append(select);
	})
	
 	$('#submitOptionBtn').click(function() {
		if (!$validateOptionForm.checkForm()) {
			$validateOptionForm.defaultShowErrors();
			return;
		}
		var url = $(this).attr("url");
		var message = "确定要添加问卷选项到这个方案吗？";
		$.loy.confirm(message, function() {
			$.loy.ajax({
				url : url,
				data : $("#optionForm").serialize(),
				success : function(data) {
					$('#optionModalDiv',$planContainer).modal("hide");
					optionGrid.jqGrid().trigger("reloadGrid");
				},
				error : function(data) {
					alert("发生错误");
				}
			});
		});
	});
	
	function  createplanGrid(){
		planGrid =jQuery(grid_selector).loyGrid({
			url: 'fatp/findAll',
			datatype: "json",
			mtype: 'GET',
			colNames:colNames,
			colModel: [
				{ name: 'id', index: 'id',sortable:false, width: 0, align: "center", editable: true,hidden:true} ,
		   		{ name: 'name', index: 'name',sortable:false, width: 150, align: "center", editable: true} ,
		   		{ name: 'title', index: 'title',sortable:false, width: 150, align: "center", editable: true},
		   		{ name: 'role', index: 'role',sortable:false, width: 150, align: "center", editable: true} ,
		   		{ name: 'description', index: 'description',sortable:false, width: 200, align: "center", editable: true} ,
		   		{ name: 'planStartTime', index: 'planStartTime',sortable:false, width: 150, align: "center", editable: true} ,
		   		{ name: 'planEndTime', index: 'planEndTime',sortable:false, width: 150, align: "center", editable: true} ,
		   		{ name: 'planState', index: 'planState',sortable:false, width: 100, align: "center",
		   			formatter:function(cellvalue, options, rowObject) {
		   				var mestext="";
		   				switch (cellvalue) {
						case 1:
							mestext="已建立未启用";
							break;
						case 2:
							mestext="已启用还未开始";
							break;
						case 3:
							mestext="已启用进行中";
							break;
						case 4:
							mestext="已正常结束";
							break;
						case 5:
							mestext="手动关闭";
							break;
						default:
							break;
						}
		   				var returnval='<a href="#" onclick=changePlanState("'
		   						+rowObject.id
								+ '","'
								+ cellvalue
		   						+'")>'+mestext+'</a>';
		   				return returnval;
		   			}
		   		},
		   		{ name:	'',index:'', width:200, fixed:true, sortable:false, resize:false ,align: "center",
					formatter:function(cellvalue, options, rowObject) {
						var button = '';
						if(hasPermissionByCode('resource:update')){
							button +='<div title="'+$.jgrid.nav.edittitle+'" onclick=planEdit("'+rowObject.id+'");  style="float:left;margin-left:33px;" class="ui-pg-div ui-inline-del"  onmouseover="jQuery(this).addClass(\'ui-state-hover\');" onmouseout="jQuery(this).removeClass(\'ui-state-hover\');"  data-original-title="所选记录"><span class="ui-icon ui-icon-pencil"></span></div>';
						}
						if(hasPermissionByCode('resource:del')){
							var del ='<div title="'+$.jgrid.nav.deltitle+'" onclick=planDel("'+rowObject.id+'");  style="float:left;margin-left:5px;" class="ui-pg-div ui-inline-del"  onmouseover="jQuery(this).addClass(\'ui-state-hover\');" onmouseout="jQuery(this).removeClass(\'ui-state-hover\');"  data-original-title="所选记录"><span class="ui-icon ace-icon ace-icon fa fa-trash-o red"></span></div>';
							button += del;   
						}
						var bindDoorplate= '<div title="'
							+ "选择小区"
							+ '" onclick=choseCourt("'
							+ rowObject.id
							+ '");  style="float:left;margin-left:5px;" class="ui-pg-div ui-inline-del"  onmouseover="jQuery(this).addClass(\'ui-state-hover\');" onmouseout="jQuery(this).removeClass(\'ui-state-hover\');"  data-original-title="所选记录"><span class="ui-icon ace-icon fa fa-building blue"></span></div>';
							button += bindDoorplate;
							
						var wenjuan= '<div title="'
							+ "问卷调查管理"
							+ '" onclick=addwenjuan("'
							+ rowObject.id
							+ '");  style="float:left;margin-left:5px;" class="ui-pg-div ui-inline-del"  onmouseover="jQuery(this).addClass(\'ui-state-hover\');" onmouseout="jQuery(this).removeClass(\'ui-state-hover\');"  data-original-title="所选记录"><span class="ui-icon ace-icon fa fa-bar-chart green"></span></div>';
							button += wenjuan;
							
						var message= '<div title="'
							+ "查看留言"
							+ '" onclick=checkLeaveMessage("'
							+ rowObject.id
							+ '");  style="float:left;margin-left:5px;" class="ui-pg-div ui-inline-del"  onmouseover="jQuery(this).addClass(\'ui-state-hover\');" onmouseout="jQuery(this).removeClass(\'ui-state-hover\');"  data-original-title="所选记录"><span class="ui-icon ace-icon fa fa-comment-o red"></span></div>';
							button += message;
						return button;
					}
				}
			],
			pager : pager_selector,
			width : $(".page-content").width(),
			height : getGridDefaultHeight(),
		    }).loyGrid('navGrid', '#plan_grid-pager', {
				"baseUrl" : "yz/",
				accessCodePrefix : 'addyzInfo',
				"addfunc":function(){
					planAdd('');
				},
				view: false,
				add:true,
				edit:false,
				del:false,
				excel:false
		    });
			planGrid.jqGrid('setFrozenColumns');
	}
	
});
function clearplanForm(){
	$validateplanForm.resetForm();
	$('#planId',$planContainer).val('');
	$('#planName',$planContainer).val('');
	$('#planTitle',$planContainer).val('');
	$('#planRole',$planContainer).val('');
	$('#planStartTime',$planContainer).val('');
	$('#planEndTime',$planContainer).val('');
	$('#planDescription',$planContainer).val('');
	$('.dz-preview').remove(); 
}
function planEdit (id){
	if(planMuban==null){
		planMuban=document.querySelector('#planpreview-template').innerHTML;
	}
	if(planDropzone!=null){
		planDropzone.destroy();
	}
	initPlanDropZone(planMuban);
	clearplanForm();
	$("#planDialogTitle").text("修改投票方案");
	$('#submitplanBtn',$planContainer).attr("url","fatp/addfatpInfo");
	$('#planModalDiv',$planContainer).modal("show");
	$.loy.ajax({
		url:'fatp/findOne',
		shade:false,
		data:{id:id},
		success:function(data){
			var result = data.data;
			var reg = new RegExp("-","g");
			$('#planId',$planContainer).val(result.id?result.id:'');
			$('#planName',$planContainer).val(result.name?result.name:'');
			$('#planTitle',$planContainer).val(result.title?result.title:'');
			$('#planRole',$planContainer).val(result.role?result.role:'');
			$('#planStartTime',$planContainer).val(result.planStartTime?result.planStartTime.replace(reg,'/'):'');
			$('#planEndTime',$planContainer).val(result.planEndTime?result.planEndTime.replace(reg,'/'):'');
			$('#planDescription',$planContainer).val(result.description?result.description:'');
			
			$.loy.ajax({
				url : "/sys/img/getFiles",
				showSuccess : false,
				type : 'GET',
				data : {
				    aId : result.id
				},
				success : function(data) {
				    $.each(data.data, function(index, item) {
						var mockFile = {
						    id : item.id,
						    name : item.medianame,
						    size : item.mediasize,
						    httpurl : item.httpurl
						};
		
						// Call the default addedfile event handler
						MDropzone.emit("addedfile", mockFile);
						// And optionally show the thumbnail of the file:
						MDropzone.emit("thumbnail", mockFile, item.httpurl);
	
				    });
				    
				    $('.dropzone [data-rel="colorbox"]').colorbox(colorbox_params);
				}
		    });
		}
   });
}
function planAdd(){
	if(planMuban==null){
		planMuban=document.querySelector('#planpreview-template').innerHTML;
	}
	if(planDropzone!=null){
		planDropzone.destroy();
	}
	initPlanDropZone(planMuban);
	clearplanForm();
	$('#submitplanBtn',$planContainer).attr("url","fatp/addfatpInfo");
	$('#planModalDiv',$planContainer).modal({
		show:true
	});
	$("#planDialogTitle").text("添加投票方案");
}
function planDel(id){
	var that=this;
	$.loy.confirm($.i18n.prop('confirm_info_del'),function(){
		$.loy.ajax({
			url:'fatp/delfatpInfo',
			data:{id:id},
			success:function(data){
				that.refreshGrid();
			}
	   });   
	});	
}
function choseCourt(planId){
	$("#planIdincourt").val(planId);
	
	//加载已经绑定了小区
	$.loy.ajax({
		url : "/xq/findSelectedCourt",
		type : 'GET',
		data : {
			planid : $("#planIdincourt").val()
		},
		success : function(data) {
			var result=data.data;
			for (var i = 0; i < result.length; i++) {
				var option=$("<option></option>");
				option.val(result[i].id);
				option.text(result[i].name);
				option.attr("selected","selected");
				$('#dualCourtlist').append(option);
			}
			courtbindBox = $('#dualCourtlist').bootstrapDualListbox();
			countbindContainer = courtbindBox.bootstrapDualListbox('getContainer');
			countbindContainer.find('.btn').addClass('btn-white btn-info btn-bold');
		},
		error : function(data){
		}
	})
   $('#courtBindDiv', $planContainer).modal("show");
}
function refreshGrid(){
	planGrid.jqGrid().trigger("reloadGrid");
}

function clearOptionForm() {
	$validateOptionForm.resetForm();
	$('#doorplateNo').val('');
}

function refreshOptionGrid() {
	optionGrid.jqGrid().trigger("reloadGrid");
}
function optionAdd(planid){
	clearOptionForm();
	$('#planId2').val(planid);
	$("#optionId").val('');
	$('#submitOptionBtn').attr("url", "wjxx/addwjxxInfo");
	$('#optionModalDiv', $planContainer).modal("show");
}
function addwenjuan(planid){
	$('#allPlanId').val(planid);
	$('#optionGridDiv', $planContainer).modal("show");
	createOptionGrid(planid);
}
function createOptionGrid(planid){
	var grid_selector2 = "#option_grid-table";
	var pager_selector2 = "#option_grid-pager";
	var colNames = ['','问题描述','同意字段','否定字段','排序','赞成票数','反对票数','操作'];
	$(grid_selector2).jqGrid('GridUnload');
	optionGrid = jQuery(grid_selector2).loyGrid({
		url : 'wjxx/findOptionByPlan',
		datatype : "json",
		postData: {"planid" : planid},
		mtype : 'GET',
		colNames : colNames,
		colModel : [
			{
				name : 'id',
				index : 'id',
				sortable : false,
				width : 15,
				align : "center",
				editable : true,
				hidden : true
			},
			{
				name : 'detail',
				index : 'detail',
				sortable : false,
				width : 3,
				align : "center",
				editable : true
			},
			{
				name : 'agree',
				index : 'agree',
				sortable : false,
				width : 1,
				align : "center",
				editable : true
			},
			{
				name : 'disagree',
				index : 'disagree',
				sortable : false,
				width : 1,
				align : "center",
				editable : true
			},
			{
				name : 'optionorder',
				index : 'optionorder',
				sortable : false,
				width : 1,
				align : "center",
				editable : true
			},
			{
				name : 'ayes',
				index : 'ayes',
				sortable : false,
				width : 1,
				align : "center",
				editable : true
			},
			{
				name : 'nays',
				index : 'nays',
				sortable : false,
				width : 1,
				align : "center",
				editable : true
			},
			{
				name : '',
				index : '',
				width : 2,
				sortable : false,
				align : "center",
				formatter : function(
						cellvalue,
						options,
						rowObject) {
					var button = '';
					if (hasPermissionByCode('resource:update')) {
						button += '<div title="'
								+ $.jgrid.nav.edittitle
								+ '" onclick=optionEdit("'
								+ rowObject.id
								+ '");  style="float:left;margin-left:25px;" class="ui-pg-div ui-inline-del"  onmouseover="jQuery(this).addClass(\'ui-state-hover\');" onmouseout="jQuery(this).removeClass(\'ui-state-hover\');"  data-original-title="所选记录"><span class="ui-icon ui-icon-pencil"></span></div>';
					}
					if (hasPermissionByCode('resource:del')) {
						var del = '<div title="'
								+ $.jgrid.nav.deltitle
								+ '" onclick=optionDel("'
								+ rowObject.id
								+'");  style="float:left;margin-left:5px;" class="ui-pg-div ui-inline-del"  onmouseover="jQuery(this).addClass(\'ui-state-hover\');" onmouseout="jQuery(this).removeClass(\'ui-state-hover\');"  data-original-title="所选记录"><span class="ui-icon ace-icon ace-icon fa fa-trash-o red"></span></div>';
						button += del;
					}
					var checkResult = '<div title="'
						+ "查看投票结果"
						+ '" onclick=checkVoteResult("'
						+ rowObject.id
						+'");  style="float:left;margin-left:5px;" class="ui-pg-div ui-inline-del"  onmouseover="jQuery(this).addClass(\'ui-state-hover\');" onmouseout="jQuery(this).removeClass(\'ui-state-hover\');"  data-original-title="所选记录"><span class="ui-icon ace-icon ace-icon fa fa-user-secret green"></span></div>';
					button += checkResult;
					return button;
				}
			}],
				pager : pager_selector2,
				gridComplete:function(){
		        	$(this).jqGrid('setGridWidth', 660);
                },
				height : '303px',
			}).loyGrid('navGrid',
				pager_selector2, {
				"baseUrl" : "mp/",
				accessCodePrefix : 'addmpInfo',
				"addfunc" : function() {
					optionAdd(planid);
				},
				view : false,
				add : true,
				edit : false,
				del : false,
				refresh : false,
				excel : false
			});
	optionGrid.jqGrid('setFrozenColumns');
}

function optionEdit(optionId){
	clearOptionForm();
	$('#submitOptionBtn').attr("url", "wjxx/addwjxxInfo");
	$('#optionModalDiv', $planContainer).modal("show");
	$.loy.ajax({
		url : 'wjxx/findOne',
		method : "GET",
		shade : false,
		data : {
			id : optionId
		},
		success : function(data) {
			var result = data.data;
			$('#optionDetail').val(result.detail ? result.detail : '');
			$("#optionId").val(result.id ? result.id : '');
			$('#optionAgree').val(result.agree ? result.agree : '');
			$('#optionDisagree').val(result.disagree ? result.disagree : '');
			$('#optionOptionorder').val(result.optionorder ? result.optionorder : '');
			$('#planId2').val(result.planid ? result.planid : '');
		}
	});
}

function optionDel(optionId){
	var message="确定要删除这条记录吗？";
	var that = this;
	$.loy.confirm(message, function() {
		$.loy.ajax({
			url : 'wjxx/delwjxx',
			data : {
				id : optionId
			},
			success : function(data) {
				that.refreshOptionGrid();
			}
		});
	});
}

function leaveMessageDel(PlanMessageId){
	var message="确定要删除这条记录吗？";
	var that = this;
	$.loy.confirm(message, function() {
		$.loy.ajax({
			url : 'vote/delLeaveMessage',
			data : {
				id : PlanMessageId
			},
			success : function(data) {
				leaveMessageGrid.jqGrid().trigger("reloadGrid");
			}
		});
	});
}

function checkVoteResult(optionId){
	$("#wenjuanOptionId").val(optionId);
	$('#voteResultGridDiv', $planContainer).modal("show");
	loadCourtSelect($("#allPlanId").val());
	createVoteResultGrid(optionId);
}

function loadCourtSelect(planid){
	//加载小区下拉框
	$.loy.ajax({
		url : "/xq/findSelectedCourt",
		type : 'GET',
		data : {
			planid : planid
		},
		success : function(data) {
			var result=data.data;
			$("#courtVoteResultSelect,#courtLeaveMessageSelect").empty();
			var option=$("<option></option>");
			option.val("");
			option.text("全部");
			$("#courtVoteResultSelect,#courtLeaveMessageSelect").append(option);
			for (var i = 0; i < result.length; i++) {
				var option=$("<option></option>");
				option.val(result[i].id);
				option.text(result[i].name);
				$("#courtVoteResultSelect,#courtLeaveMessageSelect").append(option);
			}
		},
		error : function(data) {
			alert("加载小区列表失败");
		}
   });
}

function createVoteResultGrid(optionId){
	var grid_selector3 = "#voteResult_grid-table";
	var pager_selector3 = "#voteResult_grid-pager";
	var colNames = ['','小区名称','业主姓名','投票结果','票数'];
	$(grid_selector3).jqGrid('GridUnload');
	voteResultGrid = jQuery(grid_selector3).loyGrid({
		url : 'vote/searchOption',
		datatype : "json",
		postData: {
			"optionId" : optionId,
			"courtId" : $("#courtVoteResultSelect").val(),
			"proprietorName" : $("#proprietorName2").val()
		},
		mtype : 'GET',
		colNames : colNames,
		colModel : [
			{
				name : 'id',
				index : 'id',
				sortable : false,
				width : 15,
				align : "center",
				editable : true,
				hidden : true
			},
			{
				name : 'courtName',
				index : 'courtName',
				sortable : false,
				width : 3,
				align : "center",
				editable : true
			},
			{
				name : 'proprietorName',
				index : 'proprietorName',
				sortable : false,
				width : 1,
				align : "center",
				editable : true
			},
			{
				name : 'result',
				index : 'result',
				sortable : false,
				width : 1,
				align : "center",
				editable : true,
				formatter : function(
						cellvalue,
						options,
						rowObject) {
					switch (cellvalue) {
					case 1:
						return "同意";
						break;
					case 2:
						return "反对";
						break;
					default:
						break;
					}
				}
			},
			{
				name : 'ballot',
				index : 'ballot',
				sortable : false,
				width : 1,
				align : "center",
				editable : true
			}],
				pager : pager_selector3,
				gridComplete:function(){
		        	$(this).jqGrid('setGridWidth', 560);
                },
				height : '303px',
			}).loyGrid('navGrid',pager_selector3, {
				view : false,
				add : false,
				edit : false,
				del : false,
				refresh : false,
				excel : false
			});
	optionGrid.jqGrid('setFrozenColumns');
}

function checkLeaveMessage(planId){
	$("#leaveMessagePlanId").val(planId);
	$('#checkLeaveMessageGridDiv', $planContainer).modal("show");
	loadCourtSelect(planId);
	createLeaveMessageGrid(planId);
}

function createLeaveMessageGrid(planId){
	var grid_selector4 = "#leaveMessage_grid-table";
	var pager_selector4 = "#leaveMessage_grid-pager";
	var colNames = ['','小区名称','业主姓名','留言','操作'];
	$(grid_selector4).jqGrid('GridUnload');
	leaveMessageGrid = jQuery(grid_selector4).loyGrid({
		url : 'vote/getLeaveMessage',
		datatype : "json",
		postData: {
			"planId" : planId,
			"courtId" : $("#courtLeaveMessageSelect").val(),
			"proprietorName" : $("#proprietorName3").val()
		},
		mtype : 'GET',
		colNames : colNames,
		colModel : [
			{
				name : 'id',
				index : 'id',
				sortable : false,
				width : 15,
				align : "center",
				editable : true,
				hidden : true
			},
			{
				name : 'courtName',
				index : 'courtName',
				sortable : false,
				width : 2,
				align : "center",
				editable : true
			},
			{
				name : 'proprietorName',
				index : 'proprietorName',
				sortable : false,
				width : 1,
				align : "center",
				editable : true
			},
			{
				name : 'message',
				index : 'message',
				sortable : false,
				width : 3,
				align : "center",
				editable : true
			},
			{
				name : '',
				index : '',
				width : 1,
				sortable : false,
				align : "center",
				formatter : function(
						cellvalue,
						options,
						rowObject) {
					if (hasPermissionByCode('resource:del')) {
						var del = '<div title="'
								+ $.jgrid.nav.deltitle
								+ '" onclick=leaveMessageDel("'
								+ rowObject.id
								+'");  style="float:left;margin-left:20px;" class="ui-pg-div ui-inline-del"  onmouseover="jQuery(this).addClass(\'ui-state-hover\');" onmouseout="jQuery(this).removeClass(\'ui-state-hover\');"  data-original-title="所选记录"><span class="ui-icon ace-icon ace-icon fa fa-trash-o red"></span></div>';
						return del;
					}
				}
			}],
				pager : pager_selector4,
				gridComplete:function(){
		        	$(this).jqGrid('setGridWidth', 560);
                },
				height : '363px',
			}).loyGrid('navGrid',pager_selector4, {
				view : false,
				add : false,
				edit : false,
				del : false,
				refresh : false,
				excel : false
			});
	leaveMessageGrid.jqGrid('setFrozenColumns');
}

function changePlanState(planId,planState){
	//需要先判断是否绑定了小区以及是否添加了问卷调查选项
	$.loy.ajax({
		url:'fatp/findOne',
		shade:false,
		data:{id:planId},
		success : function(data) {
			var result = data.data;
			if(!result.isbindCourt){
				$.loy.alert("方案还没有分配小区，不能开始进行");
				return;
			}
			else if(!result.iscreateOption){
				$.loy.alert("方案还没有创建问卷选项，不能开始进行");
				return;
			}
			else{
				$('#allPlanId').val(planId);
				if(planState==1){
					$("#planStateYes").removeAttr("checked","checked");
					$("#planStateNo").removeAttr("checked","checked");
				}
				if(planState==2||planState==3){
					$("#planStateYes").attr("checked","checked");
				}
				if(planState==4||planState==5){
					$("#planStateNo").attr("checked","checked");
				}
				$('#changeVoteStateDiv', $planContainer).modal("show"); 
			}
		}
	});
}

function initPlanDropZone(planMuban){
	planDropzone=new Dropzone("#plandropzone",{
	    url : "/sys/img/upload", //必须填写
	    method : "post", //也可用put
	    paramName : "file", //默认为file 
	    headers : $.loy.token(),
	    maxFiles : 10,//一次性上传的文件数量上限
	    maxFilesize : 20, //MB
	    acceptedFiles : ".jpg,.gif,.png", //上传的类型  
	    dictDefaultMessage : "",
	    dictMaxFilesExceeded : "一次只能上传10张图片!",
	    addRemoveLinks : false,
	    clickable : ".fileinput-button", // 点击某个按钮或区域后出现选择电脑中本地图片，默认是previewsContainer指定的区域
	    previewTemplate : planMuban,//设置显示模板					    
	    init : function() {

		MDropzone = this;

		this.on("removedfile", function(file) {
		});

		this.on("addedfile", function(file) {
		    //上传文件时触发的事件
		    file.previewElement.querySelector('[data-rel]').setAttribute('id', file.id);
		    file.previewElement.querySelector('[data-rel]').setAttribute('href', file.httpurl);

		});

		this.on("queuecomplete", function() {
		    $('.dropzone [data-rel="colorbox"]').colorbox(colorbox_params);
		});

		this.on("success", function(file, data) {
		    //上传完成后触发的方法	    
		    file.previewElement.querySelector('[data-rel]').setAttribute('id', data.data.obj.id);
		    file.previewElement.querySelector('[data-rel]').setAttribute('href', data.data.obj.httpurl);

		});
		this.on("error", function(file, message) {
		    //this.removeFile(file);  
		    //$.loy.alert(message.data ? message.data.error : message,'error');	
		    $(file.previewElement).find('[data-dz-errormessage]').html(message.data ? message.data.error : message);
		});
	    }

	});
}
</script>